<template>
	<view>
		<cu-custom :bgColor="globalData.bgColor" :isBack="true">
			<template #content>
				<text class="text-darkgrey">{{ $t('home.index.o5y08i') }}</text>
			</template>
		</cu-custom>
		<!-- <view class=" bg-gray text-sm padding-sm text-grey">
			<text class="cuIcon-info margin-right-xs "></text>目前只提供基本数据操作，编辑数据请在电脑端操作。
		</view> -->
		<view class="padding-top-xs">
			<view v-for="(item, index) in menuList" :key="index">
				<!-- 菜单名 -->
				<!-- <view v-if="meunPermissions.indexOf(item.menuName) != -1" class="cu-bar" style="min-height: auto">
					<view class="padding-sm text-lg text-bold">
						{{ item.menuName }}
					</view>
				</view> -->
				<!-- 菜单内容 -->
				<view v-if="meunPermissions.indexOf(item.menuName) != -1" class="grid col-2">
					<view class="flex align-center" v-for="(menu, index) in item.menus" :key="index">
						<navigator hover-class="none" class="padding-xs" style="width: 100%;" :url="'/pages/' + menu.url">
							<view class="bg-white flex align-center padding-tb padding-lr-sm radius-lg">
								<image :src="menu.icon" style=" width: 80rpx; height: 80rpx"></image>
								<view class="margin-left-sm text-grey">{{ menu.title }}</view>
							</view>
						</navigator>
					</view>
					<view v-if="!item.menus || item.menus.length == 0" class="text-center padding">{{ $t('home.shop-home.dr6s84') }}</view>
				</view>
			</view>
		</view>
		<view v-if="!menuList || menuList.length == 0" class="text-center padding">{{ $t('home.shop-home.dr6s84') }}</view>
	</view>
</template>

<script>
import { GetMenu } from '@/api/upms/menu';

export default {
	onLoad() {
		// 初始化菜单
		this.GetMenu();
	},
	data() {
		return {
			globalData: getApp().globalData,
			CustomBar: this.CustomBar,
			meunPermissions: [],
			menuList: [],
			menuListSrc: [
				{
					menuName: this.$t('home.index.o5y081'),
					textColor: 'text-darkgrey',
					menus: [
						{
							title: this.$t('home.shop-home.84pufm'),
							url: 'mall/shop/list',
							color: 'cyan',
							icon: '/static/public/icon/service-store.png'
						},
						{
							title: this.$t('home.shop-home.1672go'),
							url: 'mall/userInfo/list',
							color: 'cyan',
							icon: '/static/public/icon/service-user.png'
						},
						{
							title: this.$t('home.shop-home.472a67'),
							url: 'mall/shopUser/list',
							color: 'cyan',
							icon: '/static/public/icon/service-user.png'
						},{
							title: this.$t('home.shop-home.h24drv'),
							url: 'mall/goodsspu/list',
							color: 'cyan',
							icon: '/static/public/icon/service-allgoods.png'
						},
						{
							title: this.$t('home.shop-home.eucp8r'),
							url: 'mall/goodsappraises/list',
							color: 'cyan',
							icon: '/static/public/icon/service-evaluation.png'
						},
						{
							title: this.$t('home.shop-home.fah548'),
							url: 'mall/order/list',
							color: 'cyan',
							icon: '/static/public/icon/service-all-order.png'
						},
						{
							title: this.$t('home.shop-home.ur33n7'),
							url: 'mall/orderrefunds/list',
							color: 'cyan',
							icon: '/static/public/icon/service-refund.png'
						},
						{
							title: this.$t('home.shop-home.r4r225'),
							url: 'mall/points/pointsconfig',
							color: 'cyan',
							icon: '/static/public/icon/service-integral.png'
						},
						{
							title: this.$t('home.shop-home.o4mct7'),
							url: 'mall/points/pointsrecord',
							color: 'cyan',
							icon: '/static/public/icon/service-integral-detail.png'
						},
						{
							title: this.$t('home.shop-home.dklcr7'),
							url: 'mall/coupon/couponinfo',
							color: 'cyan',
							icon: '/static/public/icon/service-coupons.png'
						},
						{
							title: this.$t('home.shop-home.7n5pi4'),
							url: 'mall/coupon/couponuser',
							color: 'cyan',
							icon: '/static/public/icon/service-coupons-draw.png'
						},
						{
							title: this.$t('home.shop-home.850cxu'),
							url: 'mall/bargain/bargaininfo',
							color: 'cyan',
							icon: '/static/public/icon/service-bargain.png'
						},
						{
							title: this.$t('home.shop-home.xd2341'),
							url: 'mall/bargain/bargainuser',
							color: 'cyan',
							icon: '/static/public/icon/service-bargain-detail.png'
						},
						{
							title: this.$t('home.shop-home.ppw352'),
							url: 'mall/groupon/grouponinfo',
							color: 'cyan',
							icon: '/static/public/icon/service-group-detail.png'
						},
						{
							title: this.$t('home.shop-home.o69xc4'),
							url: 'mall/groupon/grouponuser',
							color: 'cyan',
							icon: '/static/public/icon/service-group.png'
						},
						{
							title: this.$t('home.shop-home.l34fv1'),
							url: 'mall/seckill/seckillinfo',
							color: 'cyan',
							icon: '/static/public/icon/service-seckill.png'
						},
						{
							title: this.$t('home.shop-home.it8om8'),
							url: 'mall/seckill/seckillhall',
							color: 'cyan',
							icon: '/static/public/icon/service-seckill-venue.png'
						},
						// {
						//     title: '运费模板',
						// 	url: 'mall/shop/list',
						//     color: 'cyan',
						//     cuIcon: 'newsfill',
						// },
						// {
						//     title: '保障服务管理',
						//     url: 'mall/shop/list',
						//     color: 'cyan',
						//     cuIcon: 'newsfill',
						// },
						// {
						//     title: '素材库',
						//     url: 'mall/shop/list',
						//     color: 'cyan',
						//     cuIcon: 'newsfill',
						// },
						// {
						// 	title: '规格管理',
						// 	url: 'mall/shop/list',
						// 	color: 'cyan',
						// 	cuIcon: 'newsfill',
						// },
						// {
						// 	title: '商品类目',
						// 	url: 'mall/shop/list',
						// 	color: 'cyan',
						// 	cuIcon: 'newsfill',
						// },
					]
				},
			]
		};
	},
	methods: {
		GetMenu() {
			//获取系统菜单
			GetMenu().then((res) => {
				const data = res.data;
				data.forEach((ele) => {
					//设置菜单是否显示
					if (ele.path == '/mall') {
						//商城模块
						this.childMenuQuery(ele.children);
					}
				});
				// 删除没有权限的菜单数据
				this.menuList = this.menuListSrc.map((item) => {
					item.menus = item.menus.filter((menu) => {
						return this.meunPermissions.indexOf(menu.title) != -1;
					});
					return item;
				});
			});
		},
		childMenuQuery(childs) {
			if (childs && childs.length > 0) {
				childs.forEach((child) => {
					//所有菜单
					this.meunPermissions.push(child.name);
					this.childMenuQuery(child.children);
				});
			}
		}
	}
};
</script>

<style>
	page{
		background-color: #f9f9f9;
	}
	
	.gw-menu-item{
		background-color: unset;
	}
	
	.radius-lg{
		border-radius: 10rpx;
	}
</style>
